@import './constant.less';

.login, .register{
	.am-input-label{
		.iconfont{
			font-size: .4rem;
			color: @font-color;
		}
	}
	.am-list-item .am-input-label.am-input-label-5{
		width: 55px;
	}
	.register{
		margin-top: 20px;
		a{
			color: @font-color;
			font-size: .28rem;
		}
		.fr{
			float: right;
		}
	}
}

.zone{
	.top{
		background: #108ee9;
    	color: #fff;
    	padding: .4rem;
    	position: relative;
    	.setting{
    		position: absolute;
		    top: .4rem;
		    right: .4rem;
		    i{
		    	font-size: .4rem;
		    	color: #fff;
		    }
    	}
    	.img{
    		border-radius: 50%;
    		border: 4px solid #ececec;
    		width: 1.5rem;
    		height: 1.5rem;
    		overflow: hidden;
    		display: inline-block;
    		img{
    			display: block;
    			width: 100%;
    			height: 100%;
    		}
    	}
    	.center{
    		display: inline-block;
    		vertical-align: top;
    		font-size: .3rem;
    		padding: .3rem 0 0 .3rem;
    		font-weight: normal;
    		p{
    			font-size: .25rem;
    			margin-top: .1rem;
    		}
    	}
	}
	.am-list-thumb{
		.iconfont{
			font-size: .35rem;
			color: #108ee9;
		}
	}
}

.updata-user{
	.am-image-picker-list .am-flexbox .am-flexbox-item:nth-child(4n), .am-image-picker-list .am-flexbox .am-flexbox-item:nth-child(4n+3){
		display: none;
	}
}

.experience{
	.slider{
		a {
			display: inline-block;
			width: 100%;
			img {
				width: 100%;
				vertical-align: top;
			}
		}
	}
}

.home{
	background: #f5f5f9;
	.slider{
  		background: #fff;
		a {
			display: inline-block;
			width: 100%;
			margin: 0; padding: 0;
			img {
				width: 100%;
				vertical-align: top;
			}
		}
	}
	.am-grid{
		padding: .2rem 0;
		background: #fff;
	}
	.am-grid.am-grid-line .am-flexbox .am-flexbox-item:after,.am-grid.am-grid-line .am-flexbox:after{
		display: none;
	}
	.am-grid .am-flexbox .am-flexbox-item.am-grid-item:before{
		padding-bottom: 80%;
	}
	.grid-a{
		display: block;
		width: 100%;
		height: 100%;
		text-align: center;
		i{
			width: .8rem;
		    height: .8rem;
		    display: inline-block;
		    border-radius: .8rem;
		    line-height: .8rem;
		    vertical-align: top;
		    font-size: .4rem;
		    margin-top: .2rem;
		}
		span{
			display: block;
			color: #555;
			font-size: .25rem
		}
	}
}

.sign-in{
    .t{
      line-height: .64rem;
      padding: .3rem .2rem;
      font-size: .34rem;
      text-align: center;
			margin-top: .3rem;
      .fr{
        float: right;
        color: #666;
      }
    }
    .center{
      text-align: center;
      padding-top: 1.3rem;
    }
    .btn{
      border-radius: 2rem;
      width: 3.6rem;
      height: 3.6rem;
      box-shadow: 0 .04rem .16rem #666;
      background: @primary-color;
      display: inline-block;
      color: #fff;
      text-align: center;
      line-height: 3.6rem;
      font-size: .56rem;
    }
}

.activity{
	.am-flexbox .am-flexbox-item{
		margin-left: 0;
	}
}

.chat{
	.chat-bg{
		background: #efefef;
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
	}
	.chat-z{
		z-index: 3;
		position: relative;
	}
	&-con{
		padding: 0 20px;
		background: #efefef;
	}
	.p{
	    line-height: .6rem;
	    padding: .15rem 0;
	}
	.p .arrow{
		position:absolute;
		top: .3rem;
		left: -.4rem;
		right: auto;
		width:0;
		height:0;
		font-size:0;
		border:solid .2rem;
		border-color:transparent #fff transparent transparent;
	}
	.p .msg{
		background: #fff;
		border-radius: .15rem;
		position: relative;
		padding: .15rem .18rem;
		text-align: left;
		font-size: .3rem;
		color: #333;
	}
	.self{
		text-align: right;
		.arrow{
			border-color:transparent transparent transparent @primary-color;
			right: -0.35rem;; /* 圆角的位置需要细心调试哦 */
			left: auto;
		}
		.msg{
			background: @primary-color;
			color: #fff;
		}
		.c-9{
			color: #eee;
		}
	}
	.p .icon{
		display: inline-block;
		width: 1rem;
		height: 1rem;
		margin-top: .6rem;
		border-radius: .6rem;
	}
	.p .r{
		display: inline-block;
		vertical-align: top;
		max-width: 60%;
		margin-left: .3rem;
		margin-right: .3rem;
	}
	.name{
		font-size: .3rem;
	}
	.c-9{
		color: #999;
		font-size: .25rem;
	}
	.oh{
		height:400px;
		overflow-y:auto;
		margin-bottom: 20px;
	}
}

.chat, .questionMsg{
	.am-list-item .am-input-extra{
		overflow: visible;
		.am-button-primary{
			font-size: .3rem;
		    line-height: .6rem;
		    height: .6rem;
		    padding: 0 .14rem;
		    position: relative;
		    top: -.15rem;
		}
	}
}

.question{
	.question-add{
		position: fixed;
		right: .2rem;
		bottom: 1.2rem;
		border-radius: 1rem;
		background: @primary-color;
		width: .72rem;
		height: .72rem;
		color: #fff;
		padding: .05rem;
		transform: rotate(45deg);
		.am-icon-lg{
			width: .72rem;
			height: .72rem;
		}
	}
}
